<template>
  <div class="app-container">
    <el-form label-width="120px">

      <el-form-item label="单位名称">
        <el-select v-model="job.unitId" placeholder="请选择">
          <el-option
            v-for="item in units"
            :key="item.id"
            :label="item.name"
            :value="item.id"/>
        </el-select>
      </el-form-item>

      <el-form-item label="职位名称">
        <el-input v-model="job.jobName" placeholder="请输入"/>
      </el-form-item>

      <el-form-item label="招考人数">
        <el-input-number v-model="job.capacity" controls-position="right" min="-0.5" step="1" step-strictly/>
      </el-form-item>

      <el-form-item label="年龄范围">
        <el-input-number v-model="job.minAge" controls-position="right" min="-1.5" step="1" step-strictly/> ~ <el-input-number v-model="job.maxAge" :min="job.minAge" controls-position="right" step="1" step-strictly/>
      </el-form-item>

      <el-form-item label="性别要求">
        <el-select v-model="job.sex" placeholder="请选择">
          <el-option :key="0" :value="0" label="男"/>
          <el-option :key="1" :value="1" label="女"/>
          <el-option :key="-1" :value="-1" label="不限"/>
        </el-select>
      </el-form-item>

      <el-form-item label="民族要求">
        <el-input v-model="job.nation" placeholder="请输入"/>
      </el-form-item>

      <el-form-item label="政治面貌要求">
        <el-select v-model="job.political" placeholder="请选择">
          <el-option :key="0" :value="0" label="党员"/>
          <el-option :key="1" :value="1" label="共青团员"/>
          <el-option :key="2" :value="2" label="群众"/>
        </el-select>
      </el-form-item>

      <el-form-item label="学历要求">
        <el-select v-model="job.education" placeholder="请选择">
          <el-option :key="0" :value="0" label="小学"/>
          <el-option :key="1" :value="1" label="初中"/>
          <el-option :key="2" :value="2" label="高中"/>
          <el-option :key="3" :value="3" label="中专"/>
          <el-option :key="4" :value="4" label="本科"/>
          <el-option :key="5" :value="5" label="大专"/>
          <el-option :key="6" :value="6" label="硕士研究生"/>
          <el-option :key="7" :value="7" label="博士研究生"/>
        </el-select>
      </el-form-item>

      <el-form-item label="专业要求">
        <el-input v-model="job.major" placeholder="请输入"/>
      </el-form-item>

      <el-form-item label="试卷类型">
        <el-input v-model="job.testType" placeholder="请输入"/>
      </el-form-item>

      <el-form-item label="考试名称">
        <el-input v-model="job.testName" placeholder="请输入"/>
      </el-form-item>

      <el-form-item label="考试地点">
        <el-input v-model="job.testLocation" placeholder="请输入"/>
      </el-form-item>

      <el-form-item label="备注">
        <el-input
          v-model="job.remarks"
          size="small"
          maxlength="200"
          type="textarea"
          placeholder="请输入"/>
      </el-form-item>
      <el-form-item label="考试费用">
        <el-input-number v-model="job.price" controls-position="right" min="-0.01" step="0.1" step-strictly/>
      </el-form-item>

      <el-form-item label="时间范围">
        <el-date-picker
          v-model="job.beginTime"
          type="datetime"
          placeholder="选择起始时间"
          value-format="yyyy-MM-dd HH:mm:ss"
          default-time="00:00:00"
        />
        ~
        <el-date-picker
          v-model="job.endTime"
          type="datetime"
          placeholder="选择结束时间"
          value-format="yyyy-MM-dd HH:mm:ss"
          default-time="00:00:00"
        />

      </el-form-item>

      <el-form-item>
        <el-button :disabled="saveBtnDisabled" type="primary" @click="saveOrUpdate">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import job from '@/api/hr/job'
import unit from '@/api/hr/unit'
export default {
  data() {
    return {
      job: {},
      units: {},
      saveBtnDisabled: false
    }
  },
  watch: {
    $route(to, from) {
      console.log('watch $route')
      this.init()
    }
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      if (this.$route.params && this.$route.params.id) {
        const id = this.$route.params.id
        this.getInfo(id)
      } else {
        this.job = {}
      }
      unit.get_units()
        .then(response => {
          this.units = response.data.units
        })
    },
    getInfo(id) {
      job.get_job(id)
        .then(response => {
          this.job = response.data.job
        })
    },
    saveOrUpdate() {
      if (!this.job.id) {
        this.save_job()
      } else {
        this.update_job()
      }
    },
    update_job() {
      job.update_job(this.job)
        .then(response => {
          this.$message({
            type: 'success',
            message: '修改成功!'
          })
          this.$router.push({ path: '/job/table' })
        })
    },
    save_job() {
      job.add_job(this.job)
        .then(response => {
          this.$message({
            type: 'success',
            message: '添加成功!'
          })
          this.$router.push({ path: '/job/table' })
        })
    }
  }
}
</script>
